<template>
  <div class="app-container">
    <!--设置菜单-->
    <el-col :span="1.5">
      <el-tabs v-model="activeName" @tab-click="handleClick" v-if="open2!=true">
        <el-tab-pane label="商品管理" name="2"/>
        <el-tab-pane label="商品分类" name="1"/>
<!--        <el-tab-pane label="轮播广告" name="3"/>-->
<!--        <el-tab-pane label="管理员" name="6"/>-->
      </el-tabs>
    </el-col>
    <!--数据表格-->
    <!--商品分类-->
    <el-col :span="24" v-if="activeName==='1'">
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <router-link :to="'/mer/restaurant'" class="link-type">
            <el-button icon="el-icon-back" size="mini">
              返 回
            </el-button>
          </router-link>
        </el-col>
        <el-col :span="1.5">
          <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd1">新增</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="success" icon="el-icon-edit" size="mini" :disabled="single"
                     @click="handleUpdate1">修改</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple"
                     @click="handleDelete1">删除</el-button>
        </el-col>
      </el-row>
      <el-table v-loading="loading" key="table1" :data="typeList1" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="ID" align="center" prop="id" />
        <el-table-column label="类型名称" align="center" prop="typeName" />
        <el-table-column label="状态" align="center">
          <template slot-scope="scope">
            <div>
              <el-tag v-if="scope.row.state === 0" style="cursor: pointer" :type="''">可用</el-tag>
              <el-tag v-else style="cursor: pointer" :type=" 'info' ">不可用</el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="图标" align="center">
          <template slot-scope="scope">
            <a :href="scope.row.imgPath" target="_blank" v-if="scope.row.imgPath!=null && scope.row.imgPath!=='null' && scope.row.imgPath!==''">
              <img :src="scope.row.imgPath" title="点击打开" class="el-avatar" style="width: 60px;height: 60px;">
            </a>
          </template>
        </el-table-column>
        <el-table-column label="排序" align="center" prop="sort" />
        <el-table-column label="操作" align="center" width="200px">
          <template slot-scope="scope">
<!--            <el-button size="mini" type="text" icon="el-icon-user-solid">-->
<!--              <router-link :to="'/product/rule/relation?cateChildId=' + scope.row.id + '&cateChildName=' + scope.row.typeName" class="link-type">-->
<!--                规格绑定-->
<!--              </router-link>-->
<!--            </el-button>-->
            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate1(scope.row)"
                       v-hasPermi="['module:producttype:edit']">修改</el-button>
            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete1(scope.row)"
                       v-hasPermi="['module:producttype:remove']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total > 0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList1"/>
    </el-col>
    <!--商品管理-->
    <el-col :span="24" v-if="activeName==='2'&& open2 == false">
      <el-row :gutter="10" class="mb8">
        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
          <el-form-item label="服务名称" prop="storeName">
            <el-input v-model="queryParams2.storeName" placeholder="请输入服务名称" clearable size="mini"/>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery2">搜索</el-button>
          </el-form-item>
        </el-form>
        <el-col :span="1.5">
          <router-link :to="'/mer/restaurant'" class="link-type">
            <el-button icon="el-icon-back" size="mini">
              返 回
            </el-button>
          </router-link>
        </el-col>
        <el-col :span="1.5">
          <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd2">新增</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="success" icon="el-icon-edit" size="mini" :disabled="single"
                     @click="handleUpdate2">修改</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple"
                     @click="handleDelete2">删除</el-button>
        </el-col>
      </el-row>
      <el-tabs v-model="typesName" type="card"  @tab-click="handleClick2">
        <el-tab-pane label="全部" name="0"/>
        <el-tab-pane v-for="type in typeList"
                     :key="type.id"
                     :label="type.typeName"
                     :value="type.id"
                     :name="String(type.id)"></el-tab-pane>
      </el-tabs>
      <el-table v-loading="loading" key="table2" :data="productList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="商品ID" align="center" prop="id" width="70"/>
        <el-table-column label="商品名称" align="center" prop="storeName" />
        <el-table-column label="售罄" align="center" key="isSaleOut">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.isSaleOut"
                       :active-value="1"
                       :inactive-value="0"
                       @change="handleChangeSaleOut(scope.row)"></el-switch>
          </template>
        </el-table-column>
        <el-table-column label="商品图片" align="center" prop="imagePath" >
          <template slot-scope="scope">
            <a :href="scope.row.imagePath" style="color: #42b983" target="_blank">
              <img :src="scope.row.imagePath" title="点击打开" style="width:80px;height:50px;">
            </a>
          </template>
        </el-table-column>
        <el-table-column label="商品分类" align="center" prop="cateName" />
        <el-table-column label="商品价格" align="center" prop="price" >
          <template slot-scope="scope">
            {{scope.row.price + '/' + scope.row.unitName}}
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center" prop="isShow">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.isShow === 0" style="cursor: pointer" :type="'info'">已下架</el-tag>
            <el-tag v-if="scope.row.isShow === 1" style="cursor: pointer" :type="''">已上架</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="排序" align="center" prop="sort" />
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="120">
          <template slot-scope="scope">
            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate2(scope.row)"
                       v-hasPermi="['module:product:edit']">修改</el-button>
            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete2(scope.row)"
                       v-hasPermi="['module:product:remove']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

    </el-col>
    <!--轮播管理-->
    <el-col :span="24" v-if="activeName==='3'">
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <router-link :to="'/mer/restaurant'" class="link-type">
            <el-button icon="el-icon-back" size="mini">
              返 回
            </el-button>
          </router-link>
        </el-col>
        <el-col :span="1.5">
          <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd3">新增</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="success" icon="el-icon-edit" size="mini" :disabled="single"
                     @click="handleUpdate3">修改</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple"
                     @click="handleDelete3">删除</el-button>
        </el-col>
      </el-row>

      <el-table v-loading="loading" key="table3" :data="bannerList1">
        <el-table-column type="selection" width="55" align="center" />
        <!--          <el-table-column label="广告类型" align="center" prop="adTypeName" />-->
        <el-table-column label="链接类型" align="center" prop="linkTypeName" />
        <el-table-column label="链接地址" align="center" prop="linkUrl" />
        <el-table-column label="状态" align="center">
          <template slot-scope="scope">
            <div>
              <el-tag v-if="scope.row.state === 0" style="cursor: pointer" :type="''">显示</el-tag>
              <el-tag v-else style="cursor: pointer" :type=" 'info' ">停用</el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="图片" align="center">
          <template slot-scope="scope">
            <a :href="scope.row.imgPath" style="color: #42b983" target="_blank">
              <img :src="scope.row.imgPath" title="点击打开" class="el-avatar" style="width: 100px;height: 60px;">
            </a>
          </template>
        </el-table-column>
        <el-table-column label="排序" align="center" prop="sort" />
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
          <template slot-scope="scope">
            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate3(scope.row)"
                       v-hasPermi="['module:banner:edit']">修改</el-button>
            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete3(scope.row)"
                       v-hasPermi="['module:banner:remove']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total > 0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList3"/>

    </el-col>
    <!--管理员-->
    <el-col :span="24" v-if="activeName==='6'">
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <router-link :to="'/mer/restaurant'" class="link-type">
            <el-button icon="el-icon-back" size="mini">
              返 回
            </el-button>
          </router-link>
        </el-col>
        <el-col :span="1.5">
          <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd6">新增</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="success" icon="el-icon-edit" size="mini" :disabled="single"
                     @click="handleUpdate6">修改</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple"
                     @click="handleDelete6">删除</el-button>
        </el-col>
      </el-row>
      <el-table v-loading="loading" key="table6" :data="userList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="50" align="center" />
        <el-table-column label="登录名" align="center" prop="userName" />
        <el-table-column label="用户昵称" align="center"  prop="nickName" />
        <el-table-column label="微信昵称" align="center"  prop="wxNickName" >
          <template slot-scope="scope">
            <div v-if="scope.row.wxNickName!= ''">{{scope.row.wxNickName}}</div>
            <div v-if="scope.row.wxNickName == ''">未绑定微信账号</div>
          </template>
        </el-table-column>
        <el-table-column label="手机号码" align="center" prop="phoneNum" />
        <el-table-column label="状态" align="center" prop="status">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.status"
                       active-value="0"
                       inactive-value="1"
                       @change="handleStatusChange6(scope.row)"/>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="270" class-name="small-padding fixed-width" fixed="right">
          <template slot-scope="scope" v-if="scope.row.userId !== 1">
            <el-button size="mini" type="text" icon="el-icon-edit" @click="bandWxUser(scope.row)"
                       v-hasPermi="['module:meruser:edit']">绑定微信用户</el-button>
            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate6(scope.row)"
                       v-hasPermi="['module:meruser:edit']">修改</el-button>
            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete6(scope.row)"
                       v-hasPermi="['module:meruser:remove']">删除</el-button>
            <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)"
                         v-hasPermi="['module:meruser:resetPwd', 'module:meruser:edit']">
                <span class="el-dropdown-link">
                  <i class="el-icon-d-arrow-right el-icon--right"></i>更多
                </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="handleResetPwd" icon="el-icon-key"
                                  v-hasPermi="['module:meruser:resetPwd']">重置密码</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total > 0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList6"/>
    </el-col>

    <!--模拟菜单-->
<!--    <el-col style="width: 325px" v-if="open2!=true">-->
<!--      <div class="kuangjia">-->
<!--        <div class="dianming">-->
<!--          {{this.testData.merName}}-->
<!--        </div>-->
<!--        <div class="zhuohao">-->
<!--          {{this.testData.tableName+":"}}-->
<!--        </div>-->
<!--        <el-col :span="5">-->
<!--          <div class="xuanxiangka">-->
<!--            <el-tabs v-model="typesName" class="xuanxiang" tab-position="left"  @tab-click="handleClick2">-->
<!--              <el-tab-pane-->
<!--                v-for="type in typeList"-->
<!--                :key="type.id"-->
<!--                :label="type.typeName"-->
<!--                :value="type.id"-->
<!--                :name="String(type.id)"-->
<!--              ></el-tab-pane>-->
<!--            </el-tabs>-->
<!--          </div>-->
<!--        </el-col>-->
<!--        <el-col :span="19">-->
<!--          <div class="lunbo">&lt;!&ndash;轮播图&ndash;&gt;-->
<!--            <el-carousel height="130px">-->
<!--              <el-carousel-item v-for="item in bannerList" :key="item" :autoplay="false">-->
<!--                <viewer style="height: 130px;">-->
<!--                  <img :key="index" :src="item"   class="lunboImg">-->
<!--                </viewer>-->
<!--              </el-carousel-item>-->
<!--            </el-carousel>-->
<!--          </div>-->
<!--          <div class="shangpinkuang" >&lt;!&ndash;商品&ndash;&gt;-->
<!--            <div v-for="pro in product" class="shangpin">-->
<!--              <div class="shangpintukuang">&lt;!&ndash;图片&ndash;&gt;-->
<!--                <img :src="pro.image" class="shangpinImg">-->
<!--              </div>-->
<!--              <div class="shangpinName">-->
<!--                {{pro.storeName}}-->
<!--              </div>-->
<!--              <div class="shangpinInfo">-->
<!--                {{pro.storeInfo}}-->
<!--              </div>-->
<!--              <div class="shangpinpage">-->
<!--                {{"￥"+pro.price}}-->
<!--              </div>-->
<!--            </div>-->
<!--          </div>-->
<!--          <div class="height=5px"></div>-->
<!--        </el-col>-->
<!--      </div>-->
<!--    </el-col>-->

    <!--弹出菜单-->
    <!--商品分类-->
    <el-dialog :title="title" :visible.sync="open1" width="650px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="类型名称" prop="typeName">
              <el-input v-model="form.typeName" placeholder="请输入类型名称" size="mini"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="排序索引" prop="sort">
              <el-input v-model="form.sort" placeholder="请输入顺序排序" type="number" size="mini"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="前端路由" prop="linkUrl">
              <el-input v-model="form.linkUrl" placeholder="请输入前端路由" size="mini"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="状态" prop="state">
              <el-radio-group v-model="form.state">
                <el-radio :value="0" :label="0">正常</el-radio>
                <el-radio :value="1" :label="1">停用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="微信显示" prop="isShow">
              <el-radio-group v-model="form.isShow">
                <el-radio :value="0" :label="0">不显示</el-radio>
                <el-radio :value="1" :label="1">显示</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
        <el-form-item label="图标" prop="imgUrl">
          <single-pic v-model="form.imgPath" type="image" @handleChecked="chooseImg" :uploadType="2" :num="1" :width="120" :height="120" />
        </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button :loading="buttonLoading" size="mini" type="primary" @click="submitForm1">确 定</el-button>
        <el-button @click="cancel1" size="mini">取 消</el-button>
      </div>
    </el-dialog>
    <!--商品管理-->
    <div v-if="open2">
      <!-- 添加或修改商品对话框 -->
      <el-form ref="form" :model="form" :rules="rules2" label-width="150px" class="product-edit-view ">
        <el-scrollbar wrap-class="scrollbar-wrapper">
          <el-row>
            <el-col :span="12">
              <el-form-item label="商品名称" prop="storeName">
                <el-input size="mini" v-model="form.storeName" placeholder="请输入商品名称" ref="storeName"/>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="商品简介" prop="storeInfo" style="width:50%;">
                <el-input type="textarea" size="mini" v-model="form.storeInfo" placeholder="请输入商品简介" rows="3"/>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="商品图片">
                <single-pic v-if="form.productImgs!=null && form.productImgs.length > 0"
                            v-model="form.productImgs[0].imgUrlPath" type="image" @handleChecked="chooseGoodsImg"
                            :uploadType="1" :num="1" :width="150" :height="150" />
                <single-pic  v-else type="image" @handleChecked="chooseGoodsImg"
                             :uploadType="1" :num="1" :width="150" :height="150" />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="轮播图">
                <imageUpload :uploadType="1" v-model="form.sliderImagePath" @handleUploadSuccess="chooseLunboImg" @handleRemove="removeImg"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
              <el-col :span="5">
                <el-form-item label="商品单位" prop="unitName">
                  <el-input v-model="form.unitName" size="mini" placeholder="请输入商品单位" />
                </el-form-item>
              </el-col>
              <el-col :span="5">
                <el-form-item label="商品规格" prop="specType">
                  <el-radio-group v-model="form.specType" @change="changeSpec" size="mini">
                    <el-radio :value="0" :label="0">单规格</el-radio>
                    <el-radio :value="1" :label="1">多规格</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
          </el-row>
          <el-row>
              <el-col :span="12">
                <el-form-item label="商品分类" prop="cateId" style="width:50%;">
                  <el-select v-model="form.cateId" style="width: 100%;" @change="confirm" size="mini">
                    <el-option v-for="item in productTypeChildOptions"
                               :key="item.id" :label="item.typeName"
                               :value="item.id">{{ item.typeName }}</el-option>
                  </el-select>
                </el-form-item>
              </el-col>
          </el-row>
          <el-row>
              <el-col :span="24" v-if="form.specType === 1" class="noForm">
                <el-col :span="24">
                  <el-form-item label="选择规格：" prop="ruleId"  style="width: 35%;">
                    <div class="acea-row row-middle">
                      <el-select v-model="form.ruleId" style="width: 100%;" @change="confirm" size="mini">
                        <el-option v-for="rule in ruleListOptions"
                                   :key="rule.id" :label="rule.ruleName"
                                   :value="rule.id"/>
                      </el-select>
                    </div>
                  </el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item v-if="attrs.length!==0">
                    <div v-for="(item, index) in attrs" :key="index">
                      <div class="acea-row row-middle"><span class="mr5">{{item.value}}</span>
                        <i class="el-icon-circle-close"  @click="handleRemoveRole(index)"></i>
                      </div>
                      <div class="rulesBox">
                        <el-tag type="dot" closable color="primary" class="mr20"
                                v-for="(j, indexn) in item.detail"
                                :key="indexn" :name="j"
                                @close="handleRemove2(item.detail,indexn)">{{j}}</el-tag>
                        <el-input placeholder="请输入属性名称" v-model="item.detail.attrsVal" style="width: 200px" size="mini">
                          <el-button slot="append" size="mini" type="primary" @click="createAttr(item.detail.attrsVal,index)">添加</el-button>
                        </el-input>
                      </div>
                    </div>
                  </el-form-item>
                </el-col>
                <el-col :span="24" v-if="createBtn">
                  <el-form-item>
                    <el-button type="primary" icon="md-add" @click="addBtn" class="mr15" size="mini">添加新规格</el-button>
                    <el-button type="success" @click="generate(0)" size="mini">立即生成</el-button>
                    <el-button type="warning" @click="generate(1)" size="mini">重新生成</el-button>
                  </el-form-item>
                </el-col>
                <el-col :span="24" v-if="showIput">
                  <el-col  :xl="6" :lg="9" :md="10" :sm="24" :xs="24" >
                    <el-form-item label="规格：">
                      <el-input  placeholder="请输入规格" v-model="formDynamic.attrsName" size="mini" />
                    </el-form-item>
                  </el-col>
                  <el-col  :xl="6" :lg="9" :md="10" :sm="24" :xs="24">
                    <el-form-item label="规格值：">
                      <el-input v-model="formDynamic.attrsVal" placeholder="请输入规格值" size="mini" />
                    </el-form-item>
                  </el-col>
                  <el-col :xl="6" :lg="5" :md="10" :sm="24" :xs="24" >
                    <el-button type="primary" @click="createAttrName" size="mini">确定</el-button>
                    <el-button type="danger" @click="offAttrName" size="mini">取消</el-button>
                  </el-col>
                </el-col>
                <!-- 多规格设置-->
                <el-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24" v-if="manyFormValidate!==undefined
                          && manyFormValidate.length && form.header.length!==0 && attrs.length!==0">
                  <!-- 多规格表格-->
                  <el-col :span="24">
                    <el-form-item label="商品属性：" class="labeltop">
                      <el-table :data="manyFormValidate" size="mini" style="width: 50%;">
                        <el-table-column type="myindex" v-for="(item,index) in form.header" :key="index"
                                         :label="item.title" :property="item.slot" align="center">
                          <template slot-scope="scope">
                            <div v-if="scope.column.property.indexOf('value') !== -1" align="center">
                              {{ scope.row[scope.column.property] }}
                            </div>
                            <div v-else-if="scope.column.property === 'action'" align="center" >
                              <a @click="delAttrTable(scope.$index)" align="center">删除</a>
                            </div>
                            <div v-else align="center">
                              <el-input v-model="scope.row[scope.column.property]" align="center" size="mini"/>
                            </div>
                          </template>
                        </el-table-column>

                      </el-table>
                    </el-form-item>
                  </el-col>
                </el-col>
              </el-col>
              <!-- 单规格表格-->
              <el-col :xl="23" :lg="24" :md="24" :sm="24" :xs="24" v-if="form.specType === 0">
                <el-form-item >
                  <el-table :data="oneFormValidate" size="mini" style="width: 50%;">
                    <el-table-column prop="price" label="售价" align="center">
                      <template slot-scope="scope">
                        <el-input type="text" v-model="scope.row.price" size="mini"/>
                      </template>
                    </el-table-column>
                    <el-table-column prop="otPrice" label="原价" align="center">
                      <template slot-scope="scope">
                        <el-input type="text" v-model="scope.row.otPrice" size="mini"/>
                      </template>
                    </el-table-column>
                    <el-table-column prop="stock" label="库存" align="center">
                      <template slot-scope="scope">
                        <el-input type="text" v-model="scope.row.stock" size="mini"/>
                      </template>
                    </el-table-column>
                  </el-table>
                </el-form-item>
              </el-col>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="展示价格" prop="labelPrice" >
                <el-input v-model="form.labelPrice" size="mini" placeholder="请输入展示价格" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="排序" prop="sort" >
                <el-input v-model="form.sort" type="number" placeholder="请输入排序" size="mini"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="当前销量" prop="sales">
                <el-input v-model="form.sales" type="number" placeholder="请输入当前销量" size="mini"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="状态" prop="isShow">
                <el-radio-group v-model="form.isShow" size="mini">
                  <el-radio v-for="dict in productStateOption"
                            :label="parseInt(dict.dictValue)">{{dict.dictLabel}}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
<!--            <el-col :span="24" v-if="form.isDel === 1">-->
<!--              <el-form-item label="恢复上线" prop="isDel">-->
<!--                <el-radio-group v-model="form.isDel" size="mini">-->
<!--                  <el-radio :value="0" :label="0">恢复上线（取消删除）</el-radio>-->
<!--                  <el-radio :value="1" :label="1">继续放在回收站</el-radio>-->
<!--                </el-radio-group>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="18">-->
<!--              <el-form-item label="购买须知" prop="buyingTips">-->
<!--                <editor v-model="form.buyingTips" :min-height="192" size="mini"/>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
            <el-col :span="18">
              <el-form-item label="产品描述" prop="description">
                <editor v-model="form.description" :min-height="192" size="mini"/>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row>
            <el-col :span="18">
              <el-form-item label="购买须知" prop="buyingTips">
                <editor v-model="form.buyingTips" :min-height="192" size="mini"/>
              </el-form-item>
            </el-col>
          </el-row>

        </el-scrollbar>
      </el-form>

      <div slot="footer" class="dialog-footer" style="margin-top: 10px">
        <el-button :loading="buttonLoading" size="mini" type="primary" @click="submitForm2">确 定</el-button>
        <el-button @click="cancel2" size="mini">取 消</el-button>
      </div>
    </div>
    <!--轮播管理-->
    <el-dialog :title="title" :visible.sync="open3" width="550px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="轮播类型" prop="adType">
          <el-select v-model="form.adType" placeholder="请选择轮播类型" style="width:100%;" size="mini">
            <el-option v-for="dict in bannerTypeOptions"
                       :key="dict.dictValue"
                       :label="dict.dictLabel"
                       :value="parseInt(dict.dictValue)"/>
          </el-select>
        </el-form-item>
        <el-form-item label="链接类型" prop="linkType">
          <el-select v-model="form.linkType" placeholder="请选择链接类型" size="mini" style="width:100%;">
            <el-option v-for="dict in linkTypeOptions"
                       :key="dict.dictValue"
                       :label="dict.dictLabel"
                       :value="dict.dictValue"/>
          </el-select>
        </el-form-item>
        <el-form-item label="商家名称" prop="linkKey" v-if="form.linkType === 'mer'">
          <el-select v-model="form.linkKey" placeholder="请选择商家名称" size="mini" style="width:100%;">
            <el-option v-for="mer in merList"
                       :key="mer.id"
                       :label="mer.shopName"
                       :value="mer.id"/>
          </el-select>
        </el-form-item>
        <el-form-item label="通知公告" prop="linkKey" v-if="form.linkType === 'notice'">
          <el-select v-model="form.linkKey" placeholder="请选择商家名称"  size="mini" style="width:100%;">
            <el-option v-for="notice in noticeList"
                       :key="notice.noticeId"
                       :label="notice.noticeTitle"
                       :value="notice.noticeId">
              <span style="float: left">{{ notice.noticeTitle }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px" v-if="notice.noticeType === '1'">通知</span>
              <span style="float: right; color: #8492a6; font-size: 13px" v-if="notice.noticeType === '2'">公告</span>
              <span style="float: right; color: #8492a6; font-size: 13px" v-if="notice.noticeType === '3'">公共收益工示</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="链接地址" prop="linkUrl">
          <el-input v-model="form.linkUrl" placeholder="请输入链接地址" size="mini"/>
        </el-form-item>
        <el-form-item prop="imgUrl" label="图片">
          <single-pic v-model="form.imgPath" type="image" @handleChecked="chooseImg3" :uploadType="6"
                      :num="1" :width="220" :height="150" />
        </el-form-item>
        <el-form-item label="状态" prop="state">
          <el-radio-group v-model="form.state" size="mini">
            <el-radio :value="0" :label="0">正常</el-radio>
            <el-radio :value="1" :label="1">停用</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="排序索引" prop="sort">
          <el-input v-model="form.sort" type="number" placeholder="请输入排序索引" size="mini"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button :loading="buttonLoading" size="mini" type="primary" @click="submitForm3">确 定</el-button>
        <el-button @click="cancel3" size="mini">取 消</el-button>
      </div>
    </el-dialog>
    <!--管理员-->
    <el-dialog :title="title" :visible.sync="open6" width="600px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row>
          <el-col :span="12">
            <el-form-item v-if="form.userId === undefined" label="登录名" prop="userName">
              <el-input v-model="form.userName" placeholder="请输入登录名" maxlength="30" size="mini"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item v-if="form.userId === undefined" label="用户密码" prop="password">
              <el-input v-model="form.password" placeholder="请输入用户密码" type="password"
                        maxlength="20" show-password size="mini"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="用户昵称" prop="nickName">
              <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" size="mini"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="手机号码" prop="phoneNum">
              <el-input v-model="form.phoneNum" placeholder="请输入手机号码" maxlength="11" size="mini"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="邮箱" prop="email">
              <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" size="mini"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="用户性别">
              <el-select v-model="form.sex" placeholder="请选择" size="mini">
                <el-option v-for="dict in sexOptions"
                           :key="dict.dictValue"
                           :label="dict.dictLabel"
                           :value="dict.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="状态">
              <el-radio-group v-model="form.status" size="mini">
                <el-radio v-for="dict in statusOptions"
                          :key="dict.dictValue"
                          :label="dict.dictValue">{{dict.dictLabel}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注">
              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" size="mini"/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" size="mini" @click="submitForm6">确 定</el-button>
        <el-button @click="cancel6" size="mini">取 消</el-button>
      </div>
    </el-dialog>
    <!--管理员绑定微信-->
    <el-dialog :title="titleUser" :visible.sync="open7" width="750px" append-to-body>
      <el-form ref="form" :model="formMerUser" label-width="120px">
        <el-form-item label="微信编号" prop="nickName">
          <el-input v-model="formMerUser.userNo" placeholder="请输入用户昵称" size="mini" maxlength="30" @onblur="getListMpSearch">
            <template slot="append">
              <el-button @click="getListMpSearch" size="mini">搜索</el-button>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="选中微信用户" prop="userId">
          <el-select v-model="formMerUser.userId" placeholder="请选择微信昵称" size="mini" style="width:100%;"
                     @change="changeMpUser">
            <el-option label="请选择" value="0"/>
            <el-option v-for="wxUser in wxUserOptions"
                       :key="wxUser.id"
                       :label="wxUser.nickName + ( wxUser.phoneNum!=null ? '(' + wxUser.phoneNum +')' :'' )"
                       :value="wxUser.id"/>
          </el-select>
        </el-form-item>
        <el-form-item >
          <el-button type="primary" size="mini" @click="submitFormUser">确 定</el-button>
          <el-button @click="cancel7" size="mini">取 消</el-button>
        </el-form-item>
      </el-form>
      <div>
        <el-row style="width: 100%;text-align: center;line-height: 30px;">
          <el-col :span="5" style="width:20%">头像</el-col>
          <el-col :span="5" style="width:20%">昵称</el-col>
          <el-col :span="5" style="width:20%">是否是店长</el-col>
          <el-col :span="5" style="width:20%">状态</el-col>
          <el-col :span="5" style="width:20%">操作</el-col>
        </el-row>
        <el-row style="width: 100%;text-align: center;line-height: 22px;" v-for="item in merUserList">
          <el-col :span="6" style="width:20%">
            <el-avatar :src="item.faceUrl"></el-avatar>
          </el-col>
          <el-col :span="6" style="width:20%">{{ item.wxUserName }} </el-col>
          <el-col :span="6" style="width:20%">
            <el-switch v-model="item.isAdmin" :active-value="1" :inactive-value="0" @change="handleIsAdminChange(item)"/>
          </el-col>
          <el-col :span="6" style="width:20%">
            <el-switch v-model="item.state" :active-value="1" :inactive-value="0" @change="handleSetState(item)"/>
          </el-col>
          <el-col :span="6" style="width:20%">
            <el-button size="mini" @click="handleDeleteMer(item)">删除</el-button>
          </el-col>
        </el-row>
      </div>
    </el-dialog>

  </div>
</template>

<script>
  import singlePic from '@/components/SingleMaterial'
  import editor from '@/components/Editor';
  import Treeselect from '@riophae/vue-treeselect'
  import '@riophae/vue-treeselect/dist/vue-treeselect.css'
  import Template from "../wx/template";
  import {addType, delType, getType, listType, treeSelect, updateType} from "@/api/module/product/type";
  import {
    addProduct,
    delProduct2, getProduct, goAddData, handleIshotChange, isFormatAttr,
    listProduct,
    listProductByMerId, showList,
    updateProduct, changeSaleOutStatus,
  } from "@/api/module/product/list";

  import {
    addUser,
    changeUserStatus,
    delUser,
    getUser,
    listByMer,
    listUser,
    resetUserPwd,
    updateUser
  } from "@/api/system/user";
  import {listByNickName} from "@/api/module/wx/user";
  import {
    delUser as delMerUser,
    listUser as listMerUser,
    updateAdmin,
    updateUser as updateMerUser
  } from "@/api/module/mer/user";
  import {treeselect} from "@/api/system/dept";

  import {addRule, delRule, getRule, listNoPage, updateRule} from "@/api/module/product/rule";
  import {listMer, listNoPage as listNoPageMer} from "@/api/module/mer/mer";
  import {addBanner, delBanner, getBanner, listBanner, updateBanner} from "@/api/module/banner";

  import {listNotice} from "@/api/system/notice";

  export default {
    name: "merControl",
    components: {
      Template, editor, Treeselect, singlePic
    },
    data() {
      return {
        activeName:'2',
        typesName:undefined,
        // 按钮loading
        buttonLoading: false,
        // 遮罩层
        loading: true,
        // 导出遮罩层
        exportLoading: false,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        dateRange:[],
        // 总条数
        total: 0,
        titleUser:"",
        deptOptions: undefined,
        new:undefined,
        // 是否显示弹出层
        open1: false,
        open2: false,
        open3: false,
        open6: false,
        open7: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          merId:undefined,
          estateId:undefined,
          isPlatform:1,
        },
        queryParams2: {
          pageNum: 1,
          pageSize: 1000,
          merId:undefined,
          cateId:undefined,
          storeName:undefined,
          isPlatform:1,
        },
        productList:[],
        typeList:[],
        typeList1:[],
        userList:[],
        bannerList:[],
        bannerList1:[],
        // 商品表格数据
        title: "",
        isShowLimit:false,
        activeDateRange:[],
        // 是否显示弹出层
        open: false,
        productStateOption:[],
        yesOrNoOption:[],
        //总类
        productTypeOptions:[],
        restaurant:0,
        //子分类
        productTypeChildOptions:[],
        createBtn:false,
        showIput: false,
        // 规格数据
        formDynamic: {
          attrsName: '',
          attrsVal: ''
        },
        // 批量设置表格data
        oneFormBatch: [{
          price: 0,
          otPrice: 0,
          stock: 9999,
        }],
        attrs:[],
        ruleListOptions:[],
        shopListOptions:[],
        manyFormValidate: [],
        // 单规格表格data
        oneFormValidate: [
          {
            price: 0,
            otPrice: 0,
            stock: 9999,
          }
        ],
        images: [],
        // 查询参数
        queryParamsPty: {
          pageNum: 1,
          pageSize: 100,
          parentId:undefined,
          merId:undefined,
          isPlatform:1,
        },
        queryTest:{
          merId:undefined,
        },
        baocun:{
          id:undefined,
          stock:undefined,
        },
        queryProduct:{
          merId:undefined,
          cateId:undefined,
        },
        splits:[],
        merProductList: [],
        // 表单参数
        form: {},
        rules:{},
        // 默认密码
        initPassword: undefined,
        // 状态数据字典
        statusOptions: [],
        // 性别状态字典
        sexOptions: [],
        // 岗位选项
        postOptions: [],
        // 角色选项
        roleOptions: [],
        merUserList:[],
        sysUserList:[],
        // 表单参数
        defaultProps: {
          children: "children",
          label: "label"
        },
        // 商品规则值(规格)表格数据
        ruleList: [],
        attrsName: '',
        attrsVal: '',
        formNameData: [],
        formName: [],
        formMerUser:{
          id:undefined,
          merId: undefined,
          userId:undefined,
          sysUserId:undefined,
          nickName: undefined,
          userType: undefined,
          state: undefined,
          userNo:undefined,
        },
        queryParamsWxUser:{
          nickName:undefined,
          userNo:undefined,
        },
        testData:[],
        typeData:[],
        product:[],
        cateList:[],
        wxUserOptions:[],
        // 列信息
        columns: [
          { key: 0, label: `用户编号`, visible: true },
          { key: 1, label: `登录名`, visible: true },
          { key: 2, label: `用户昵称`, visible: true },
          { key: 3, label: `部门`, visible: true },
          { key: 4, label: `手机号码`, visible: true },
          { key: 5, label: `状态`, visible: true },
          { key: 6, label: `创建时间`, visible: true }
        ],
        merList:[],
        // 是否显示弹出层
        bannerTypeOptions:[],
        linkTypeOptions:[],
        // 公告表格数据
        noticeList: [],
        // 查询参数
        queryParamsMer: {
          pageNum: 1,
          pageSize: 100,
          isShowProduct:0,
        },
        // 查询参数
        queryParamsNotice: {
          pageNum: 1,
          pageSize: 10,
          noticeType: undefined,
        },
        rules2: {
          cateChildId: [
            { required: true, message: "请选择商品分类", trigger: "blur" }
          ],
          merId: [
            { required: true, message: "请选择所属商家", trigger: "blur" }
          ],
          voucherId: [
            { required: true, message: "请选择可使用的消费券", trigger: "blur" }
          ],
          image: [
            { required: true, message: "商品图片不能为空", trigger: "blur" }
          ],
          sliderImage: [
            { required: true, message: "轮播图不能为空", trigger: "blur" }
          ],
          storeName: [
            { required: true, message: "商品名称不能为空", trigger: "blur" }
          ],
          storeInfo: [
            { required: true, message: "商品简介不能为空", trigger: "blur" }
          ],
          keyword: [
            { required: true, message: "关键字不能为空", trigger: "blur" }
          ],
          cateId: [
            { required: true, message: "商品分类不能为空", trigger: "blur" }
          ],
          labelPrice: [
            { required: true, message: "商品价格不能为空", trigger: "blur" }
          ],
        },
        rules6: {
          userName: [
            { required: true, message: "登录名不能为空", trigger: "blur" }
          ],
          nickName: [
            { required: true, message: "用户昵称不能为空", trigger: "blur" }
          ],
          password: [
            { required: true, message: "用户密码不能为空", trigger: "blur" },
            { min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
          ],
          email: [
            {
              type: "email",
              message: "'请输入正确的邮箱地址",
              trigger: ["blur", "change"]
            }
          ],
          phoneNum: [
            {
              pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
              message: "请输入正确的手机号码",
              trigger: "blur"
            }
          ]
        },
        merInfo:{},
      };
    },
    created() {
      this.queryParams.merId = this.$route.query.merId?this.$route.query.merId:undefined;
      if(this.$route.query.merId){
        this.queryParams2.merId = this.$route.query.merId ? this.$route.query.merId : 0;
        this.form.merId = this.$route.query.merId ? this.$route.query.merId : 0;
        this.queryParamsPty.merId = this.$route.query.merId ? this.$route.query.merId : 0;
      }
      this.queryParams2.isBarter = this.$route.query.is_barter ? this.$route.query.is_barter : 0;
      this.getRuleList(0);
      this.getTreeSelect();
      this.getList2();
      // this.getList2();
      this.getDicts("yes_or_no").then(response => {
        this.yesOrNoOption = response.data;
      });
      this.getDicts("product_state").then(response => {
        this.productStateOption = response.data;
      });
    },
    methods: {
      //模拟窗口选项卡方法
      handleClick2(val){
        if (val.name==0){
          this.queryParams2.cateId=undefined;
          this.queryParams2.merId=this.$route.query.merId;
          this.getList2();
        }else {
          this.queryParams2.cateId=Number(val.name);
          this.queryParams2.merId=this.$route.query.merId;
          this.queryProduct.cateId=Number(val.name);
          this.queryProduct.merId=this.$route.query.merId;
          console.log('handleClick', this.queryProduct.cateId);
          this.getList2();
          this.getList8();
        }

      },
      //方法
      handleClick(val) {
        console.log('handleClick', val.name);
        this.activeName = val.name;
        let _this=this;
        if (val.name === '1') {//分类
          // this.$nextTick(() => {
          //   _this.$refs.mytable.doLayout();
          // })
          this.getList1();
        } else if (val.name === '2') {//商品
          if(this.$route.query.merId){
            this.queryParams2.merId = this.$route.query.merId ? this.$route.query.merId : 0;
            this.form.merId = this.$route.query.merId ? this.$route.query.merId : 0;
            this.queryParamsPty.merId = this.$route.query.merId ? this.$route.query.merId : 0;
          }
          this.queryParams2.isBarter = this.$route.query.is_barter ? this.$route.query.is_barter : 0;
          this.getRuleList(0);
          this.getTreeSelect();
          this.getList2();
          this.getDicts("yes_or_no").then(response => {
            this.yesOrNoOption = response.data;
          });
          this.getDicts("product_state").then(response => {
            this.productStateOption = response.data;
          });
        } else if (val.name === '3') {//广告
          this.getDicts("banner_type").then(response => {
            this.bannerTypeOptions = response.data;
            this.getList3();
          });
          this.getDicts("link_type").then(response => {
            this.linkTypeOptions = response.data;
          });
          this.getDicts("sys_normal_disable").then(response => {
            this.statusOptions = response.data;
          });
          this.getMerList();
        } else if (val.name === '6') {//管理员
          this.getUserListByUserType();
          this.getList6();
          this.getTreeselect();
          this.getDicts("sys_normal_disable").then(response => {
            this.statusOptions = response.data;
          });
          this.getDicts("sys_user_sex").then(response => {
            this.sexOptions = response.data;
          });
          this.getConfigKey("sys.user.initPassword").then(response => {
            this.initPassword = response.msg;
          });
        }
      },
      //多选按钮
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.id);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
      },
      //查询方法
      //商品分类
      getList1() {
        this.loading = true;
        listType(this.queryParams).then(response => {
          this.typeList1 = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      //商品管理
      getList2() {
        this.loading = true;
        this.queryParams.isDel = 0;
        listProduct(this.queryParams2).then(response => {
          this.productList = response.rows;
          this.total = response.total;
          this.merInfo = response.otherData.mer;
          this.loading = false;
        });
      },
      //轮播图管理
      getList3() {
        this.loading = true;
        listBanner(this.queryParams).then(response => {
          this.bannerList1 = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      //管理员
      getList6() {
        this.loading = true;
        listByMer(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
            this.userList = response.rows;
            this.total = response.total;
            this.loading = false;
          }
        );
      },
      //预览效果
      // getList7() {
      //   this.loading = true;
      //   testMerList(this.$route.query.merId).then(response =>{
      //     this.testData=response;
      //     this.typeList=response.typeList;
      //     this.bannerList=response.lunbo
      //     console.log(this.testData)
      //     console.log(this.typeList[0].id)
      //     this.queryProduct.cateId=this.typeList[0].id;
      //     this.queryProduct.merId=this.$route.query.merId;
      //     console.log('handleClick', this.queryProduct.cateId);
      //     this.getList8();
      //     console.log(this.testData)
      //   })
      // },
      //预览效果
      getList8() {
        showList(this.queryProduct).then(response =>{
          this.product = response;
          console.log( this.product)
        })
      },
      //新增按钮
      //商品分类
      handleAdd1() {
        this.reset1();
        this.open1 = true;
        this.title = "添加商品分类信息";
      },
      //商品管理
      handleAdd2() {
        this.reset2();
        this.open2 = true;
        this.title = "添加商品";
        this.attrs = [];
        this.form.header = [];
        this.form.unitName='份';
        this.form.isShow=1;
        this.manyFormValidate = [];
        this.oneFormValidate = [
          {
            price: 0,
            otPrice: 0,
            stock: 9999,
          }
        ];
        this.getProductTypeChildList();
        this.goAddData();
        this.$nextTick((x) => { //正确写法
          this.$refs.storeName.focus();
        })
      },
      //轮播图管理
      handleAdd3() {
        this.reset3();
        this.open3 = true;
        this.title = "添加轮播图";
      },
      //管理员
      handleAdd6() {
        this.reset6();
        this.getTreeselect();
        getUser().then(response => {
          this.postOptions = response.data.posts;
          this.roleOptions = response.data.roles;
          this.open6 = true;
          this.title = "添加用户";
          this.form.password = this.initPassword;
        });
      },

      //修改按钮
      //商品分类
      handleUpdate1(row) {
        this.loading = true;
        this.reset1();
        const id = row.id || this.ids;
        getType(id).then(response => {
          this.loading = false;
          this.form = response.data;
          this.open1 = true;
          this.title = "修改商品分类";
        });
      },
      //商品管理
      handleUpdate2(row) {
        var that = this;
        this.loading = true;
        this.reset2();
        this.getProductTypeChildList();
        const id = row.id || this.ids;
        getProduct(id).then(response => {
          console.log('getProduct', response.data);
          this.loading = false;
          this.form = response.data;
          this.open2 = true;
          this.title = "修改商品";
          console.log(' that.form.rule', that.form.rule);
          if (that.form.rule !== null && that.form.rule !== undefined) {
            console.log(' that.form.rule 111', that.form.rule);
            that.attrs = that.form.rule.ruleValueArray;
          }
          that.splits = response.data.splits;
          that.form.header = [];
          console.log('that.form.specType', that.form.specType);
          if (that.form.specType === 0) {//单规格
            that.manyFormValidate = [];
            console.log('response.data.productValue["默认"]', response.data.productValue["默认"]);
            that.oneFormValidate[0] = response.data.productValue["默认"];
            console.log('oneFormValidate', that.oneFormValidate)
          } else {
            //多规格
            that.createBtn = true;
            console.log('that.manyFormValidate', that.manyFormValidate);
            that.generate(0);
          }

          this.getRuleList(that.form.ruleId);
        });
      },
      //轮播图管理
      handleUpdate3(row) {
        this.loading = true;
        this.reset3();
        const id = row.id || this.ids;
        getBanner(id).then(response => {
          this.loading = false;
          this.form = response.data;
          this.open3 = true;
          this.title = "修改轮播图（广告）";
        });
      },
      //管理员
      handleUpdate6(row) {
        this.reset6();
        this.getTreeselect();
        const userId = row.userId || this.ids;
        getUser(userId).then(response => {
          this.form = response.data.user;
          this.postOptions = response.data.posts;
          this.roleOptions = response.data.roles;
          this.form.postIds = response.data.postIds;
          this.form.roleIds = response.data.roleIds;
          this.open6 = true;
          this.title = "修改用户";
          this.form.password = "";
        });
      },

      //提交方法
      //商品分类
      submitForm1() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.buttonLoading = true;
            if (this.queryParams.merId != null) {
              this.form.merId = this.queryParams.merId;
            }
            if (this.form.id != null) {
              updateType(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open1 = false;
                // this.getList7();
                this.getList1();
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              addType(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open1 = false;
                // this.getList7();
                this.getList1();
              }).finally(() => {
                this.buttonLoading = false;
              });
            }
          }else{
            this.buttonLoading = false;
          }
        });
      },
      //商品管理
      submitForm2() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.buttonLoading = true;
            if (this.form.image === undefined) {
              return this.$message.warning('请上传商品图片！');
            }
            if (this.form.sliderImage === undefined) {
              return this.$message.warning('请上传轮播图！');
            }

            if (this.form.specType === 0) {
              this.form.attrs = this.oneFormValidate;
              this.form.header = [];
              this.form.items = [];
            } else {
              this.form.items = this.attrs;
              this.form.attrs = this.manyFormValidate;
            }
            if (this.form.specType === 1 && this.manyFormValidate.length === 0) {
              return this.$message.warning('请点击生成规格！');
            }
            if (this.form.id != null) {
              updateProduct(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open2 = false;
                this.getList2();
                // this.getList7();
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              addProduct(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open2 = false;
                this.getList2();
                // this.getList7();
              }).finally(() => {
                this.buttonLoading = false;
              });
            }
          }else{
            this.buttonLoading = false;
          }
        });
      },
      //轮播图管理
      submitForm3() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if(this.queryParams.merId!=undefined){
              this.form.merId=this.queryParams.merId;
            }
            this.buttonLoading = true;
            if (this.form.id != null) {
              updateBanner(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open3 = false;
                this.getLunbo();
                // this.getList7();
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              addBanner(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open3 = false;
                this.getLunbo();
                // this.getList7();
              }).finally(() => {
                this.buttonLoading = false;
              });
            }
          }else{
            this.buttonLoading = false;
          }
        });
      },
      //管理员
      submitForm6() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            console.log(' user this.form', this.form);
            if (this.form.userId !== undefined) {
              updateUser(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open6 = false;
                this.getList6();
                // this.getList7();
              });
            } else {
              addUser(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open6 = false;
                this.getList6();
                // this.getList7();
              });
            }
          }else{
            this.buttonLoading = false;
          }
        });
      },
      //删除方法
      //商品分类
      handleDelete1(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除商品分类编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.loading = true;
          return delType(ids);
        }).then(() => {
          this.loading = false;
          this.getList1();
          // this.getList7();
          this.msgSuccess("删除成功");
        }).catch(() => {
        });
      },
      //商品管理
      handleDelete2(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除商品编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.loading = true;
          return delProduct2(ids);
        }).then(() => {
          this.loading = false;
          this.getList2();
          // this.getList7();
          this.msgSuccess("删除成功");
        }).catch(() => {
        });
      },
      //轮播图管理
      handleDelete3(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除轮播图（广告）编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.loading = true;
          return delBanner(ids);
        }).then(() => {
          this.loading = false;
          this.getList3();
          // this.getList7();
          this.msgSuccess("删除成功");
        }).catch(() => {});
      },
      //管理员
      handleDelete6(row) {
        const userIds = row.userId || this.ids;
        this.$confirm('是否确认删除用户编号为"' + userIds + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function () {
          return delUser(userIds);
        }).then(() => {
          this.getList6();
          // this.getList7();
          this.msgSuccess("删除成功");
        }).catch(() => {
        });
      },

      //取消方法
      cancel1() {
        this.open1 = false;
        this.reset1();
      },
      cancel2() {
        this.open2 = false;
        this.reset2();
      },
      cancel3() {
        this.open3 = false;
        this.reset3();
      },
      cancel6() {
        this.open6 = false;
        this.reset6();
      },
      cancel7() {
        this.open7 = false;
      },
      reset1() {
        this.form = {
          id: undefined,
          typeName: undefined,
          parentId: this.queryParams.parentId,
          state: undefined,
          imgUrl: undefined,
          imgPath: '',
          sort: undefined,
          linkUrl: undefined,
          isShow: undefined,
          isPlatform: 1,
          estateId:this.queryParams.estateId,
          merId:this.queryParams.merId,
        };
        this.resetForm("form");
      },
      reset2() {
        this.form = {
          id: undefined,
          productNo: undefined,
          merId: this.queryParams.merId,
          image: undefined,
          imagePath: undefined,
          sliderImage: undefined,
          sliderImageArray: [],
          sliderImagePath: undefined,
          storeName: undefined,
          storeInfo: undefined,
          keyword: undefined,
          isBarter: this.queryParams.isBarter,
          barCode: undefined,
          cateId: this.queryParams.cateId,
          cateChildId: undefined,
          ruleId: undefined,
          voucherId: 0,
          labelPrice: undefined,
          price: undefined,
          isVip:undefined,
          vipPrice: undefined,
          otPrice: undefined,
          postage: undefined,
          unitName: undefined,
          sort: 1,
          sales: 0,
          stock: 0,
          isSale: 1,
          isLimit: undefined,
          limitCount: undefined,
          isShow: undefined,
          isHot: undefined,
          isBenefit: 0,
          isUseIntegral: 0,
          isBest: undefined,
          isNew: undefined,
          description: '',
          createTime: undefined,
          updateTime: undefined,
          isPostage: undefined,
          isDel: undefined,
          merUse: undefined,
          giveIntegral: undefined,
          cost: undefined,
          isGood: undefined,
          ficti: undefined,
          browse: undefined,
          isCoupon: 0,
          isSub: 1,
          subType: 1,
          tempId: undefined,
          specType: 0,
          splitMoney: undefined,
          splitType: "none",
          splitTypeId: 0,
          isAppointment: 0,
          isVisit: 0,
          buyingTips: undefined,
          isActive: 0,
          activeBeginTime: undefined,
          activeEndTime: undefined,
          givenChargerMoney: 0.00,
          isCanUseGolden: 0,
          isNeedVerify: 0,
          isSaleOut:0,
          header: [],
          estates: [],
          estateIds: [],
          activeDateRange: [],
          productImgs: [],
          productImgLunbos: [],
        };
        this.resetForm("form");
      },
      reset3() {
        this.form = {
          id: undefined,
          adType: undefined,
          imgUrl: undefined,
          linkType: undefined,
          linkKey: undefined,
          linkUrl: undefined,
          merId: undefined,
          state: undefined,
          sort: undefined,
          content:undefined,
        };
        this.resetForm("form");
      },
      reset6() {
        this.form = {
          userId: undefined,
          merId: this.queryParams.merId,
          roleId: 110,
          deptId: undefined,
          userType: 4,
          userName: undefined,
          nickName: undefined,
          password: undefined,
          phoneNum: undefined,
          email: undefined,
          sex: undefined,
          status: "0",
          roleIds: [110],
          remark: undefined,
        };
        this.resetForm("form");
      },
      //商品类型
      handleChangeSaleOut(row) {
        let text = row.isSaleOut === 0 ? "未售罄" : "已售罄";
        this.$confirm('确认要修改"' + text + '"的售罄状态吗?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return changeSaleOutStatus(row.id, row.isSaleOut);
        }).then(() => {
          this.msgSuccess("修改 "+text + "成功");
        }).catch(function() {
          row.isShow = row.isShow === "0" ? "1" : "0";
        });
      },
      getDelList(){
        this.loading = true;
        this.queryParams.isDel = 1;
        listProduct(this.queryParams).then(response => {
          this.productList = response.rows;
          this.total = response.total;
          this.merInfo = response.otherData.mer;
          this.loading = false;
        });
      },
      goAddData(){
        goAddData().then(response => {
          console.log('response.data.estates',response.data.estates);
          this.form.estates = response.data.estates;
          this.splits = response.data.splits;
        });
      },
      getProductTypeChildList(){
        listType(this.queryParamsPty).then(response => {
          this.productTypeChildOptions = response.rows;
        });
      },
      getRuleList(ruleId) {
        listNoPage(ruleId).then(res => {
          this.ruleListOptions = res.data;
        })
      },
      getShopListOptions(){
        listNoPageMer().then(res => {
          this.shopListOptions = res.data;
        })
      },
      getTreeSelect() {
        treeSelect().then(res => {
          this.productTypeOptions = res.data;
          console.log('productTypeOptions',res.data)
        })
      },
      chooseGoodsImg(data){
        console.log("product chooseGoodsImg",data);
        this.form.productImgs = [];
        if(data.length > 0) {
          this.form.imagePath = data[0].imgUrl;
          this.form.image = data[0].url;

          var newImg = {
            productId:this.form.id,
            imgUrl:data[0].url,
            imgUrlPath:data[0].imgUrl,
          };
          this.form.productImgs.push(newImg) ;
        }
        console.log('this.form.productImgs',this.form.productImgs)
      },
      chooseLunboImg(data){
        console.log("product chooseLunboImg",data);
        if(this.form.productImgLunbos == undefined){
          this.form.productImgLunbos = []
        }

        this.form.sliderImage = "";
        this.form.sliderImagePath = "";
        var imgUrlArray = data.imgUrl;
        // var imgUrlArrayPath = data.imgUrl;
        for(var index in imgUrlArray){
          var fileName = imgUrlArray[index].name.replace("https://www.caihnegyun.com/chyimg/","");
          console.log(fileName);
          this.form.sliderImage += fileName + ",";
          this.form.sliderImagePath += imgUrlArray[index].url + ",";
        }
        var newImg = {
          productId:this.form.id,
          imgUrl:data.newImg.name,
          imgUrlPath:data.newImg.url,
        };
        this.form.productImgLunbos.push(newImg);
        this.form.sliderImage = this.form.sliderImage.substring(0,this.form.sliderImage.length - 1);
        this.form.sliderImagePath = this.form.sliderImagePath.substring(0,this.form.sliderImagePath.length - 1);
        console.log('sliderImageArray',this.form.sliderImageArray);
        console.log('productImgLunbos',this.form.productImgLunbos)
      },
      removeImg(data){
        console.log('removeImg',data);
        console.log('productImgLunbos',this.form.productImgLunbos);
        this.form.sliderImagePath = "";
        var imgUrlArray = data.imgList;
        for(var index in imgUrlArray){
          this.form.sliderImagePath += imgUrlArray[index].url + ",";
        }
        this.form.sliderImagePath = this.form.sliderImagePath.substring(0,this.form.sliderImagePath.length - 1);
        //删除的 索引
        var index = data.index;
        this.form.productImgLunbos.splice(index,1);
      },
      // 改变规格
      changeSpec (val) {
        console.log('changeSpec',val)
        // specType
      },
      confirm(val){
        console.log('confirm',val);
        // console.log('confirm',this.ruleListOptions[val]);
        // console.log('this.ruleListOptions[val].ruleValueArray',this.ruleListOptions[val].ruleValueArray);
        var that = this;
        for(var index in that.ruleListOptions){
          console.log('that.ruleListOptions[index]',that.ruleListOptions[index]);
          if(that.ruleListOptions[index].id === val){
            that.attrs = that.ruleListOptions[index].ruleValueArray;
            that.form.ruleId = that.ruleListOptions[index].id;
            that.createBtn = true;
          }
        }
        console.log('that.form.ruleId',that.form.ruleId);
        this.getRuleList(val);
      },
      // 立即生成
      generate (isReset) {
        console.log('generate  this.attrs',this.attrs);
        if(this.form.id === undefined){
          this.form.id = 0;
        }
        isFormatAttr(this.form.id, { attrs: this.attrs },isReset).then(res => {
          console.log('generate  isFormatAttr',res);
          this.manyFormValidate = res.data.value;
          let headerdel = {
            title: '操作',
            slot: 'action',
            fixed: 'right',
            width: 220
          };
          res.data.header.push(headerdel);
          console.log(' generate  res.data.header',res.data.header);
          this.form.header = res.data.header;
          console.log('generate  this.form.header',this.form.header);
          let header = res.data.header;
          console.log(' generate  header',header);
          header.pop();
          console.log(' generate  manyFormValidate',this.manyFormValidate);
        }).catch(res => {
        })
      },
      // 添加按钮
      addBtn () {
        this.clearAttr();
        this.createBtn = false;
        this.showIput = true;
      },
      // 取消
      offAttrName () {
        this.showIput = false;
        this.createBtn = true;
      },
      clearAttr () {
        this.formDynamic.attrsName = '';
        this.formDynamic.attrsVal = '';
      },
      // 删除规格
      handleRemoveRole (index) {
        this.attrs.splice(index, 1);
        this.manyFormValidate.splice(index, 1);
      },
      // 删除属性
      handleRemove2 (item, index) {
        item.splice(index, 1);
      },
      // 添加规则名称
      createAttrName () {
        if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
          let data = {
            value: this.formDynamic.attrsName,
            detail: [
              this.formDynamic.attrsVal
            ]
          };
          console.log('data',data);
          this.attrs.push(data);
          var hash = {};
          console.log('this.attrs',this.attrs);
          this.attrs = this.attrs.reduce(function (item, next) {
            hash[next.value] ? '' : hash[next.value] = true && item.push(next);
            return item
          }, []);
          this.clearAttr();
          this.showIput = false;
          this.createBtn = true;
        } else {
          this.$message.warning('请添加完整的规格！');
        }
      },
      // 添加属性
      createAttr (num, idx) {
        if (num) {
          this.attrs[idx].detail.push(num);
          var hash = {};
          console.log('this.attrs[idx].detail',this.attrs[idx].detail);
          this.attrs[idx].detail = this.attrs[idx].detail.reduce(function (item, next) {
            hash[next] ? '' : hash[next] = true && item.push(next);
            return item
          }, [])
        } else {
          this.$message.warning('请添加属性！');
        }
      },
      // 用户状态修改
      handleIshotChange(row) {
        let text = row.isHot === "0" ? "关闭" : "开启";
        this.$confirm('确认要"' + text + '"为热销吗?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return handleIshotChange(row.id, row.isHot);
        }).then(() => {
          this.msgSuccess(text + "成功");
        }).catch(function() {
          row.isHot = row.isHot === "0" ? "1" : "0";
        });
      },
      // 删除表格中的属性
      delAttrTable (index) {
        this.manyFormValidate.splice(index, 1);
      },
      //轮播图
      uploadCallBack(data){
        console.log('uploadCallBack',data);
        if(data.type === 'upload'){
          this.form.imgUrl = data.imgUrl.name;
        }else if(data.type === 'remove'){

        }
      },
      getNoticeList() {
        listNotice(this.queryParamsNotice).then(response => {
          this.noticeList = response.rows;
        });
      },
      getMerList() {
        listMer(this.queryParamsMer).then(response => {
          this.merList = response.rows;
        });
      },
      chooseImg3(data){
        console.log("banner chooseImg",data);
        if(data.length > 0) {
          console.log("banner imgPath",data[0].imgUrl);
          console.log("banner url",data[0].url);
          this.form.imgPath = data[0].imgUrl;
          this.form.imgUrl = data[0].url;
        }
      },
      //打印机
      //抵扣券
      checkMerProduct(val) {
        console.log('checkMerProduct', val);
        this.form.merProductIds = val;
      },
      getMerProduct() {
        this.loading = true;
        var that = this;
        listProductByMerId(that.form.merId).then(response => {
          that.merProductList = response.data;
        });
      },
      chooseImg(data) {
        console.log("menu chooseImg", data);
        if (data.length > 0) {
          this.form.imgUrlPath = data[0].imgUrl;
          this.form.imgUrl = data[0].url;
        }
      },
      //管理员
      getUserListByUserType(){
        listUser(this.queryParams).then(response => {
          this.sysUserList = response.data;
        });
      },
      changeMpUser(val){
        this.formMerUser.id = val;
        this.formMerUser.merId = this.queryParams.merId;
      },
      getListMpSearch(){
        this.queryParamsWxUser.userNo = this.formMerUser.userNo;
        this.formMerUser.merId = this.queryParams.merId;
        listByNickName(this.formMerUser).then(response => {
          console.log('getListMpSearch',response.data);
          this.wxUserOptions = response.data;
        });
      },
      getMerUserList(sysUserId){
        this.formMerUser.merId = this.queryParams.merId;
        this.formMerUser.sysUserId = sysUserId;
        listMerUser(this.formMerUser).then(response => {
          console.log('getMerUserList',response.rows);
          this.merUserList = response.rows;
        });
      },
      // 用户状态修改
      handleIsAdminChange(row) {
        let text = row.isAdmin === "0" ? "取消店长" : "设置为店长";
        this.$confirm('确认要"' + text + '""' +'"吗?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          // row.isAdmin =
          return updateAdmin(row);
        }).then(() => {
          this.msgSuccess(text + "成功");
          this.getMerUserList(this.formMerUser.sysUserId)
        }).catch(function() {
          // row.status = row.status === "0" ? "1" : "0";
          this.getMerUserList(this.formMerUser.sysUserId)
        });
      },
      // 用户状态修改
      handleSetState(row) {
        console.log('state',row.state);
        let text = row.state === "0" ? "禁用该用户" : "启用该用户";
        this.$confirm('确认要"' + text + '""' +'"吗?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          // row.isAdmin =
          return updateMerUser(row);
        }).then(() => {
          this.msgSuccess(text + "成功");
          this.getMerUserList(this.formMerUser.sysUserId)
        }).catch(function() {
          // row.status = row.status === "0" ? "1" : "0";
          this.getMerUserList(this.formMerUser.sysUserId)
        });
      },
      /** 查询部门下拉树结构 */
      getTreeselect() {
        treeselect().then(response => {
          this.deptOptions = response.data;
        });
      },
      // 筛选节点
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1;
      },
      // 节点单击事件
      handleNodeClick(data) {
        this.queryParams.deptId = data.id;
        this.getList();
      },
      // 用户状态修改
      handleStatusChange(row) {
        let text = row.status === "0" ? "启用" : "停用";
        this.$confirm('确认要"' + text + '""' + row.userName + '"用户吗?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return changeUserStatus(row.userId, row.status);
        }).then(() => {
          this.msgSuccess(text + "成功");
        }).catch(function() {
          row.status = row.status === "0" ? "1" : "0";
        });
      },
      // 更多操作触发
      handleCommand(command, row) {
        switch (command) {
          case "handleResetPwd":
            this.handleResetPwd(row);
            break;
          case "handleAuthRole":
            this.handleAuthRole(row);
            break;
          default:
            break;
        }
      },
      bandWxUser(row){
        this.open7 = true;
        this.titleUser = "绑定管理员微信";
        console.log('bandWxUser',row);
        this.getMerUserList(row.userId);
        this.formMerUser.id = row.merUserId;
        this.formMerUser.sysUserId = row.userId;
      },
      /** 重置密码按钮操作 */
      handleResetPwd(row) {
        this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          closeOnClickModal: false,
          inputPattern: /^.{5,20}$/,
          inputErrorMessage: "用户密码长度必须介于 5 和 20 之间",
        }).then(({ value }) => {
          resetUserPwd(row.userId, value).then(response => {
            this.msgSuccess("修改成功，新密码是：" + value);
          });
        }).catch(() => {});
      },
      /** 分配角色操作 */
      handleAuthRole(row) {
        const userId = row.userId;
        this.$router.push("/system/user-auth/role/" + userId);
      },
      submitFormUser(){
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.buttonLoading = true;
            if (this.formMerUser.id != null) {
              updateMerUser(this.formMerUser).then(response => {
                this.msgSuccess("绑定成功");
                // this.open6 = false;
                this.getMerUserList(this.formMerUser.sysUserId);
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              this.msgError("该用户不存在");
            }
          }
        });
      },
      handleDeleteMer(row) {
        this.$confirm('是否确认删除"' + row.wxUserName + '"?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delMerUser(row.id);
        }).then(() => {
          this.getMerUserList(this.formMerUser.sysUserId);
          this.msgSuccess("删除成功");
        }).catch(() => {});
      },
      /////////////////////////商品规格/////////////////////////
      // 删除
      handleRemove (index) {
        this.form.ruleValueArray.splice(index, 1);
      },
      // 表单重置
      reset() {
        this.form = {
          id: undefined,
          ruleName: undefined,
          createTime: undefined,
          updateTime: undefined,
          isDel: undefined,
          ruleValue:undefined,
          ruleValueArray:[]
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      handleQuery2() {
        this.getList2();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.open = true;
        this.title = "添加商品规则值(规格)";
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.loading = true;
        this.reset();
        const id = row.id || this.ids;
        getRule(id).then(response => {
          this.loading = false;
          this.form = response.data;
          this.open = true;
          this.title = "修改商品规则值(规格)";
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.buttonLoading = true;
            if (this.form.id != null) {
              updateRule(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              addRule(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              }).finally(() => {
                this.buttonLoading = false;
              });
            }
          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除商品规则值(规格)编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.loading = true;
          return delRule(ids);
        }).then(() => {
          this.loading = false;
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {});
      },
      getLunbo(){
        this.getDicts("banner_type").then(response => {
          this.bannerTypeOptions = response.data;
          this.getList3();
        });
        this.getDicts("link_type").then(response => {
          this.linkTypeOptions = response.data;
        });
        this.getDicts("sys_normal_disable").then(response => {
          this.statusOptions = response.data;
        });
        this.getMerList();
      },
    },
  }
</script>

<style lang="scss" scoped>
  .product-view{
    width: 100%;
    position: relative;
    overflow: hidden;
    .product-edit-view {
      box-shadow: 2px 2px 6px rgb(0 21 41 / 35%);
      padding: 20px;
    }
    .product-edit-view .el-scrollbar {
      height: calc(100vh - 12.5rem);
    }
    .scrollbar-wrapper{
      overflow-x: hidden !important;
    }
  }
  .kuangjia{
    //background-color: red;
    height: 600px;
    width: 350;
    margin-left: 35px;
    margin-top:15px;
    border: 3px solid #AAAAAA;
    box-shadow: 5px 5px #bbbbbb;
    border-radius: 18px;
  }
  .dianming{
    background-color: red;
    height: 35px;
    width: 350;
    text-align:center;
    font-size: 28px;
    color: #eeeeee;
    font-weight: bold;
    border-radius: 15px 15px 0px 0px;
  }
  .zhuohao{
    background-color: red;
    height: 30px;
    width: 350;
    font-size: 20px;
    color: #eeeeee;
    text-align:center;
    align-items: center;
  }
  .xuanxiangka{
    //background-color: #00FFFF;
    height: 535px;
    width: 350;
    border: 1px solid #bbbbbb;
    border-radius: 0px 0px 0px 20px;
    word-wrap:break-word;
    word-break:break-all;
  }
  .lunbo{
    //background-color:green;
    height: 135px;
    width: 350;
  }
  .shangpinkuang{
    overflow:scroll;
    overflow-x: hidden;
    //background-color: slateblue;
    height: 395px;
    width: 350;
  }
  .shangpin{
    height: 60px;
    width: auto;
    background-color: #eeeeee;
    margin-top: 1px;
    border: 1px solid #bbbbbb;
    border-radius: 5px;
  }
  .shangpinImg{
    height: 50px;
    width: 50px
  }
  .shangpinName{
    margin-top: -50px;
    margin-left: 60px;
    font-size: 17px;
  }
  .shangpinInfo{
    margin-left: 60px;
    font-size: 13px;
  }
  .shangpinpage{
    font-size: 13px;
    margin-left: 60px;
  }
  .shangpintukuang{
    //background-color:red;
    width: 50px;
    height: 50px;
    margin-top: 3px;
    margin-left: 5px;
  }
  .lunboImg{
    height: 135px;
    width: 300px
  }
  .zhuohaoText{
    top: 10px;
  }
</style>
